.ConvenientOperation {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	overflow: hidden;
	position: relative;

	& > div {
		width: 100%;

		&.Top {
			position: relative;
			z-index: 1;
			display: flex;
			align-items: center;
			justify-content: center;
			padding-right: 32px;
			box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16),
				0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);

			& > div {
				flex: 1;
				display: flex;
				align-items: center;
				justify-content: center;
				margin: 0 2px;
				font-size: 18px;
				font-family: ShuHeiTi;
				font-weight: bold;
				color: #262626;
				padding: 8px;
			}
		}

		&.List {
			flex: 1;
			overflow-y: scroll;
			padding: 16px 0;

			& > div {
				display: flex;
				align-items: center;
				justify-content: center;
				margin: 2px;

				& > input,
				& > div {
					flex: 1;
					margin: 0 2px;
				}

				& > span {
					display: flex;
					align-items: center;
					justify-content: center;
					width: 32px;
					font-size: 16px;
					color: red;
				}
			}
		}

		&.Add {
			display: flex;
			align-items: center;
			justify-content: center;
			padding: 8px 24vw;

			& > button {
				margin: 0 8px;
			}
		}
	}
}
